<template>
  <mask-module
    class="flex-v flex-hc flex-vc"
    ref="mask"
    :isClickBgToHide="false"
  >
    <div class="alert-warpper flex-v flex-vc">
      <img
        class="alert-img"
        src="../assets/login-alert.png"
      />
      <p class="baseColorNoAcitve fontsize38 big-text">该手机已与其他微信号绑定</p>
      <p class="fontsize28 small-text">是否绑定到当前微信号</p>
    </div>
    <div class="flex-h button-warpper">
      <div
        class="fontsize32 no-btn"
        @click="hide()"
      >否</div>
      <div
        class="fontsize32 baseColorNoAcitve yes-btn"
        @click="bindWechat()"
      >是</div>
    </div>
  </mask-module>
</template>

<script>
import { MaskModule } from 'vue-xb-ui-depot'
// import { thirdpartyBindPhoneLogin } from '../api/api'
export default {
  components: {
    maskModule: MaskModule
  },
  props() {
    return {
      username: {// 手机号
        type: String,
        default: ''
      },
      smsCode: {// 短信验证码
        type: String,
        default: ''
      }
    }
  },
  data() {
    return {

    }
  },
  computed: {
    mask() {
      return this.$refs.mask
    }
  },
  mounted() {

  },
  methods: {
    show() {
      this.$refs.mask.show()
    },
    hide() {
      this.$refs.mask.hide()
    },
    bindWechat() { // 绑定微信
      console.log('绑定微信')
      // console.log(this.$parent.cid)
      // console.log(this.$parent.mobileModel)
      // console.log(this.$parent.mobileVersion)
      // console.log(this.$parent.appVersion)
      this.$emit('bindWechat')
      // thirdpartyBindPhoneLogin(
      //   this.username,
      //   this.smsCode,
      //   this.$parent.cid,
      //   this.$parent.mobileModel,
      //   this.$parent.mobileVersion,
      //   this.$parent.appVersion
      // ).then(res => {
      //   console.log('loginInfo--------->')
      //   console.log(res)
      //   if (this.$refs.mySmsCode.countDownTimer) {
      //     clearInterval(this.$refs.mySmsCode.countDownTimer)
      //   }
      //   window.localStorage.setItem('fdaheoibhdio3bcoabfcil', this.username)
      //   window.localStorage.setItem('XIAOBUSESSION', res.SESSION_ID)
      //   window.localStorage.setItem('XIAOBUUSERBEAN', JSON.stringify(res))
      //   window.location.href = 'xbapp://goback?loginsuccess=1'
      // })
    }
  }
}
</script>

<style scoped>
/* 弹窗样式 */
.alert-warpper {
  font-family: 'PingFangSC-Regular, PingFang SC';
  width: 600px;
  height: 400px;
  background-color: #fff;
  border-bottom: 1px solid #ccc; /*no*/
  border-radius: 8px 8px 0 0; /*px*/
}

/* 提示图片 */
.alert-img {
  width: 250px;
  height: 250px;
}
/* 大文本 */
.big-text {
  margin: 10px 0;
}
/* 小文本 */
.small-text {
  color: #333;
}
/* 按钮包裹层 */
.buttom-warpper {
  border-radius: 0 0 8px 8px; /*px*/
}
/* 否按钮 */
.no-btn {
  width: 299px;
  height: 100px;
  line-height: 100px;
  text-align: center;
  background-color: #fff;
  border-bottom-left-radius: 8px; /*px*/
}
/* 是按钮 */
.yes-btn {
  width: 299px;
  height: 100px;
  line-height: 100px;
  text-align: center;
  background-color: #fff;
  border-left: 1px solid #ccc; /*no*/
  border-bottom-right-radius: 8px; /*px*/
}
</style>
